<script lang="ts" setup>
import { useVModel } from '@vueuse/core'
import { onUpdated, reactive, ref } from 'vue'
import to from '@/utils/awaitTo'
import { Api } from '@/api'
import { message } from 'ant-design-vue'

// 引用声明
const props = defineProps({
  open: {
    type: Boolean,
    default: false
  },

  data: {
    type: Object,
    default: () => null
  },

  form:{
    type: Object,
    default: () => {}
  }
})

// 引用事件
const emits = defineEmits(['update:open', 'callback'])

// 引用数据
const openModel = useVModel(props, 'open', emits)


const loading = ref(false)
const formRef = ref()

/** 提交事件 */
const handleSubmit = () => {
  formRef.value
    .validate()
    .then(async (values) => {
      const params = Object.assign({}, form, values)
      console.log(params)
      loading.value = true
      const [error, data] = await to(Api.tpbase.topicExamine(params))
      if (!error) {
        loading.value = false
        openModel.value = false
        message.success('审核完成,等待刷新列表')
        setTimeout(() => {
          emits('callback')
          message.success('刷新成功')
        }, 2000)
      }
    })
}




// onUpdated(() => {
//   if (openModel.value) {
//     form.auditTopicIds = [props.data.topicId] // 话题ids
//     form.sourceImageUrl = props.data.sourceImageUrl // 来源图片
//     form.topicHyperlink = props.data.topicHyperlink //话题超链接
//     form.topicType = props.data.topicType // 话题类型
//     form.status = props.data.status // 话题状态
//   }
// })
</script>

<template>
  <a-modal v-model:open="openModel" :ok-button-props="{ loading: loading }" title="审核话题" @ok="handleSubmit"
  >
    <a-form ref="formRef" :model="form">
      <!-- 审核状态   -->
      <a-form-item label="审核状态" name="auditRes">
        <a-radio-group v-model:value="form.auditRes">
          <a-radio-button
            v-for="item in TopicAuditTypeDict"
            :key="item.value"
            :value="item.value"
          >{{ item.label }}
          </a-radio-button>
        </a-radio-group>
      </a-form-item>

      <!--  驳回原因   -->
      <a-form-item
        v-if="Number(form.auditRes) === 2"
        label="驳回原因"
        name="failMsg"
      >
        <a-radio-group v-model:value="form.failMsg">
          <a-space wrap>
            <a-radio
              v-for="item in CauseRejectionDict"
              :key="item.value"
              :value="item.value"
            >{{ item.label }}
            </a-radio
            >
          </a-space>
        </a-radio-group>
      </a-form-item>

      <!--  是否有热度  -->
      <a-form-item label="是否有热度" name="topicLabel">
        <a-radio-group v-model:value="form.topicLabel">
          <a-radio
            v-for="item in isHotDict"
            :key="item.value"
            :value="item.value"
          >{{ item.label }}
          </a-radio
          >
        </a-radio-group>
      </a-form-item>

      <!-- 话题来源图片 -->
      <a-form-item v-if="Number(form.status) === 1" label="话题来源图片">
        <template v-if="Number(form.topicType) === 1001">
          <a-image
            :src="form.sourceImageUrl"
            style="width: 100px"
            width="100"
          />
        </template>
        <template v-else-if="Number(form.topicType) === 1002">
          <span>/</span>
        </template>
      </a-form-item>


      <a-form-item v-if="Number(form.status) === 1" label="话题超链接">
        <a
          v-if="Number(form.topicType) === 1001"
          :href="form.topicHyperlink"
          target="_blank"
        >查看链接</a>
        <div v-else-if="Number(form.topicType) === 1002">/</div>
      </a-form-item>

    </a-form>
  </a-modal>
</template>

<style lang="less" scoped>

</style>
